<template>
  <div class="result">
    <div class="ju-title">
      <span>绩效考核结果</span>
    </div>
    <div class="box-complete">
      <CompleteData v-bind="$attrs"></CompleteData>
    </div>
    <div class="box-situation">
      <div class="situation usual-box">
        <SituationData v-bind="$attrs"></SituationData>
      </div>
    </div>
  </div>
</template>

<script>
import CompleteData from './CompleteData.vue'
import SituationData from './SituationData.vue'
export default {
  name: 'JxResult',
  components: { CompleteData, SituationData },
  props: {},
  data() {
    return {
      completeDatas: {},
      situationDatas: {},
      topDatas: [],
    }
  },
  computed: {},
  watch: {},
  created() {},
  mounted() {
    this.pageInt()
  },
  methods: {
    pageInt() {},
  },
}
</script>

<style lang="scss" scoped>
@import './title.scss';

.result {
  .box-complete {
    margin-top: 10px;
  }

  .box-situation {
    margin-top: 30px;
    display: flex;
    align-items: stretch;
    justify-content: space-between;

    .situation {
      // width: 67.5%;
      padding: 20px;
      flex: 1;
    }

    .top {
      width: 30%;
      padding: 20px;
    }
  }
}
</style>
